// packageK/guide/guide.js
const app = getApp()
const dayjs = require('../../utils/dayjs.min')
// const marks = [
//   {id: 1, text: '仙塘老街', top: 4300, left: 1550, },
//   {id: 2, text: '大夫第', top: 2734, left: 1671, article_id: 7},
//   {id: 3, text: '柳溪书院', top: 2862, left: 2153, article_id: 9},
//   {id: 4, text: '新衙门', top: 2123, left: 2495, article_id: 6},
//   {id: 5, text: '老衙门', top: 1805, left: 3070, article_id: 5},
//   {id: 6, text: '古炮楼(碉楼)', top: 2134, left: 2974, article_id: 4},
//   {id: 7, text: '仙塘学校', top: 2394, left: 3128, article_id: 10},
//   {id: 8, text: '遗址公园', top: 2078, left: 3472, article_id: 8},
//   {id: 9, text: '奉天大夫', top: 2627, left: 3462},
//   {id: 10, text: '蟠龙古树', top: 2317, left: 3709, article_id: 11},
//   {id: 11, text: '潘公墙', top: 1934, left: 3984},
//   {id: 12, text: '老楼', top: 2126, left: 4199, article_id: 2},
//   {id: 13, text: '新楼', top: 1775, left: 4681, article_id: 3},
//   {id: 14, text: '南园文化广场', top: 2334, left: 4710, article_id: 1},
//   {id: 15, text: '游客中心', top: 2646, left: 4692},
//   {id: 16, text: '仙塘老街', top: 3387, left: 4623},
//   {id: 17, text: '游客中心(功能配套区)', top: 2358, left: 5417},
//   {id: 18, text: '仙塘老街', top: 2984, left: 5770},
//   {id: 19, text: '南园古村博物馆', top: 976, left: 6841, article_id: 12},
//   {id: 20, text: '仙塘老街', top: 1523, left: 7147}
// ]

// const identifying = [
//   {id: 1, text: '出入口'},
//   {id: 2, text: '售票处'},
//   {id: 3, text: '停车场'},
//   {id: 4, text: '游客中心'},
//   {id: 5, text: '咨询处'},
//   {id: 6, text: '医务室'},
//   {id: 7, text: '公用电话'},
//   {id: 8, text: '休息区'},
//   {id: 9, text: '无障碍通道'},
//   {id: 10, text: '卫生间'},
//   {id: 11, text: '无障碍卫生间'},
//   {id: 12, text: '家庭卫间'},
//   {id: 13, text: '母婴室'},
//   {id: 14, text: '咖啡厅'},
//   {id: 15, text: '行李寄存处'},
//   {id: 16, text: '失物招领'},
//   {id: 17, text: '导游服务'},
//   {id: 18, text: '餐厅'},
//   {id: 19, text: '宾馆'},
//   {id: 20, text: '购物场所'},
//   {id: 21, text: '充电桩'},
//   {id: 22, text: '公共汽车'},
//   {id: 23, text: '电瓶车'},
//   // {id: 24, text: '您所在位置'}
// ]
Page({

  /**
   * 页面的初始数据
   */
  data: {
    showBlur:true,
    SERVER_UR: "https://applet.nanyuangucun.com/static/images/",
    identifyingVisible: false,
    identifying:[
      {id: 25, text: '景区介绍', article_id: 14},
      {id: 1, text: '出入口'},
      {id: 2, text: '售票处'},
      {id: 3, text: '停车场'},
      {id: 4, text: '游客中心'},
      {id: 5, text: '咨询处'},
      {id: 6, text: '医务室'},
      {id: 7, text: '公用电话'},
      {id: 8, text: '休息区'},
      {id: 9, text: '无障碍通道'},
      {id: 10, text: '卫生间'},
      {id: 11, text: '无障碍卫生间'},
      {id: 12, text: '家庭卫间'},
      {id: 13, text: '母婴室'},
      {id: 14, text: '咖啡厅'},
      {id: 15, text: '行李寄存处'},
      {id: 16, text: '失物招领'},
      {id: 17, text: '导游服务'},
      {id: 18, text: '餐厅'},
      {id: 19, text: '宾馆'},
      {id: 20, text: '购物场所'},
      {id: 21, text: '充电桩'},
      {id: 22, text: '公共汽车'},
      {id: 23, text: '电瓶车'},
      // {id: 24, text: '您所在位置'}
    ],
    marks:[
      {id: 1, text: '仙塘老街', top: 4300, left: 1550, },
      {id: 2, text: '大夫第', top: 2734, left: 1671, article_id: 7},
      {id: 3, text: '柳溪书院', top: 2862, left: 2153, article_id: 9},
      {id: 4, text: '新衙门', top: 2123, left: 2495, article_id: 6},
      {id: 5, text: '老衙门', top: 1805, left: 3070, article_id: 5},
      {id: 6, text: '炮楼', top: 2134, left: 3053, article_id: 4},
      {id: 7, text: '仙塘学校', top: 2266, left: 3372, article_id: 10},
      {id: 8, text: '遗址公园', top: 2078, left: 3472, article_id: 8},
      {id: 9, text: '奉天大夫', top: 2627, left: 3462},
      {id: 10, text: '蟠龙古树', top: 2317, left: 3709, article_id: 11},
      {id: 11, text: '潘公墙', top: 1934, left: 3984},
      {id: 12, text: '老楼', top: 2126, left: 4199, article_id: 2},
      {id: 13, text: '新楼', top: 1775, left: 4681, article_id: 3},
      {id: 14, text: '客家文化广场', top: 2334, left: 4710, article_id: 1},
      {id: 15, text: '游客中心', top: 2646, left: 4692},
      {id: 16, text: '仙塘老街', top: 3387, left: 4623},
      {id: 17, text: '游客中心(功能配套区)', top: 2358, left: 5417},
      {id: 18, text: '仙塘老街', top: 2984, left: 5770},
      {id: 19, text: '南园古村博物馆', top: 976, left: 6841},
      {id: 20, text: '仙塘老街', top: 1523, left: 7147},
      {id: 21, text: '藏宝阁', top: 2168, left: 3698, article_id: 12},
      {id: 22, text: '“双百行动”实践基地', top: 2923, left: 2614, article_id: 9, article_id: 13}
    ],
    scaleValue: 0.2,
    mapImg: '',
    mapImgW: 0,
    mapImgH: 0,
    zoom: 1,
    // 地图偏移
    x: 0,
    y: 0
  },

  /**
   * mark点击跳转到详情页面
   * @param {Object} e 
   */
  markClick: function(e) {
    const { item } = e.currentTarget.dataset
    if (!item.article_id) {
      app.tips(`【${item.text}】详细介绍完善中...`)
      return
    }
    const path = '/packageA/member/article/articleContent/articleContent?article_id='
    wx.navigateTo({
      url: path + item.article_id,
    })
  },

  /**
   * 显示标识
   */
  showIdentifying: function() {
    this.setData({
      identifyingVisible: true
    })
  },

  /**
   * 隐藏标识
   */
  hideIdentifying: function() {
    this.setData({
      identifyingVisible: false
    })
  },

  /**
   * 标识点击
   */
  identifyingClick: function(e) {
    const { item } = e.currentTarget.dataset
    if (!item.article_id) {
      return
    }
    const path = '/packageA/member/article/articleContent/articleContent?article_id='
    wx.navigateTo({
      url: path + item.article_id,
    })
  },

  /**
   * 获取导览图
   */
  getMapImg: function() {
    // 如果本地缓存中有图片路径且获取日期为今天，则直接使用缓存的路径加载图片
    const mapPath = wx.getStorageSync('mapPath');
    const mapDate = wx.getStorageSync('mapDate');
    const today = dayjs().format('YYYY-MM-DD')
    if (mapPath && mapDate && mapDate == today) {
      this.getMapImgInfo(mapPath);
      return
    }
    // 如果本地缓存中有图片路径但获取日期不是今天，删除本地已保存的图片再重新获取地图图片
    if (mapPath) {
      wx.getFileSystemManager().removeSavedFile({
        filePath: mapPath
      })
    }
    wx.showLoading({
      title: '地图数据加载中...',
    })
    const { SERVER_UR } = this.data
    const that = this
    wx.downloadFile({
      url: `${SERVER_UR}map/map2.jpeg?i=2`,
      success: function(res) {
        wx.saveFile({
          tempFilePath: res.tempFilePath,
          success: function(result) {
            wx.setStorageSync('mapPath', result.savedFilePath);
            wx.setStorageSync('mapDate', today);
            that.getMapImgInfo(result.savedFilePath)
          },
          fail: function() {
            that.getMapImgInfo(res.tempFilePath)
          }
        })
      },
      fail: function(err) {
        app.tips(`获取导览图失败：${err.errMsg}`)
        console.log('downloadFile:::', err)
      },
      complete: function() {
        wx.hideLoading()
      }
    })
  },

  /**
   * 获取导览图片数据，设置图片src & width & height
   * @param {String} path 导览图的本地地址
   */
  getMapImgInfo: function(path) {
    const that = this;
    const { zoom } = this.data
    wx.getImageInfo({
      src: path,
      success: function(info) {
        that.setData({
          mapImg: info.path,
          mapImgW: info.width / zoom,
          mapImgH: info.height / zoom,
          x: 3750 / zoom,
          y: 500 / zoom
        })
      },
      fail: function() {
        // 缓存图片可能会获取不成功，则清除Storage数据，重新获取网络图
        that.updateMap()
      }
    })
  },

  /**
   * 更新导览图
   */
  updateMap: function() {
    const mapPath = wx.getStorageSync('mapPath')
    // 删除wx.saveFile保存到本地第图片
    if (mapPath) {
      wx.getFileSystemManager().removeSavedFile({
        filePath: mapPath
      })
    }
    this.setData({
      mapImg: '',
      mapImgW: 0,
      mapImgH: 0,
      x: 0,
      y: 0,
      identifyingVisible: false
    })
    wx.removeStorageSync('mapPath')
    wx.removeStorageSync('mapDate')
    this.getMapImg()
  },
  imageLoaded(){
    this.setData({
      showBlur:false
    })
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    // this.initTileData()
    // this.getMapImg()
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {
    
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {
    wx.hideHomeButton()
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {
    
  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})